---
title: Schematics
description: Schematics | Transloco Angular i18n
---

## Ng-add

### Overview

Creates boilerplate translation files for the given languages, and adds Transloco configuration for the project's root module.

### Command

```
  ng add @ngneat/transloco
```

### Options

#### Create the translation files along with the required configuration.

- `--langs`

  `type`: `string`

  `default`: `en, es`

#### Provide the translation files loader.

- `--loader`

  `type`: `string`

  `default`: `Http`

  `options`: `Http`, `Webpack`

  `alias`: `lo`

#### Define the translation files format.

- `--translate-type`

  `type`: `string`

  `default`: `JSON`

  `options`: `JSON`, `Typescript`

  `alias`: `t`

#### Provide the configuration that is needed for a project using server side rendering.

- `--ssr`

  `type`: `boolean`,

  `default`: `false`

#### Define the location of the translation files.

- `--path`

  `type`: `string`

  `default`: `assets/i18n/`

  `alias`: `p`

#### Provide the name of the project where Transloco should be installed to.

- `--project`

  `type`: `string`

#### Provide the path to a root `Module` and import `TranslocoModule` along with the module's required configuration defined by previous flags.

- `--module`

  `type`: `string`

  `default`: `app`

## Scope

### Overview

Add new Transloco scope to a new/existing Angular `module`, and create the scope's translation files.

### Command

```bash
ng generate @ngneat/transloco:scope [name]
```

### Options

Define the name of the new scope.

- `--name`

`type`: `string`

Define the path at which module to add scope to, relative to the workspace root.

Note if this flag won't be provide a new Module should be created.

- `--module`

`type`: `string`

Define the languages of the scope, default is the root languages.

- `--langs`

`type`: `string`

`alias`: `la`

Skip the creation of the translation files.

- `--skip-creation`

`type`: `boolean`

Define the format of the translation files.

- `--translate-type`

`type`: `string`

`default`: `JSON`

Define the location of the translation files.

- `--translation-path`

`type`: `string`

### Examples

```bash
ng g @ngneat/transloco:scope my-scope
ng g @ngneat/transloco:scope my-scope --module path/to/my-scope
ng g @ngneat/transloco:scope my-scope --inline-loader
```

## Component

### Overview

Creates boilerplate files for Angular `component` with a simple translation

### Command

```
ng generate @ngneat/transloco:component [name]
```

### Options

#### Define the component's name.

- `--name`

  `type`: `string`

## Join

### Overview

Merge all our translation files into one piece for each language.

### Command

```bash
ng generate @ngneat/transloco:join
```

:::info
If you have more then one entry folder for your translation files, you will have to add a mapping for each folder entry and the scope name. It could be done using scopePathMap property in your `transloco.config.js` file.
:::

By default the build script will go over the root translation file directory and will refer every sub directory as scope.

Let's say we have the following translations folder:

```
├─ src/assets/i18n/
   ├─ en.json
   ├─ fr.json
   ├─ es.json
   ├─ todos/
      ├─ en.json
      ├─ fr.json
      ├─ es.json
```

The script will run over all the directory files (minus the default language) and will merge the scope files to the main translation files.

Say our project's default language is English,  if we run the script the expected output would be:

```json title="dist-i18n/es.json"
{
  "hello": "transloco es",
  "todos": {
    "todos-translation": "todos es"
  }
}
```

```json title="dist-i18n/fr.json"
{
  "hello": "transloco fr",
  "todos": {
    "todos-translation": "todos fr"
  }
}
```

If we have more then one entry folder for a `scope` we can specify a map between the `scope` name and the path to the translations using scopePathMap property in your `transloco.config.js` file:

```js title="transloco.config.js"
{
  "scopePathMap": {
    "my-scope": "src/app/path-to-scope",
    "my-project-scope": "projects/my-project/i18n"
  }
}
```

:::info
Once you specify the scopePathMap the script will automatically use it
:::

### Examples

Merge translations files to a specific output directory:
```bash
ng g @ngneat/transloco:build --default-lang en
```

### Options

The folder that contains the root translation files.

- `--translation-path`

  `type`: `string`

  `default`: `src/assets/i18n`

  `alias`: `root`

The output directory path

- `--out-dir`

  `type`: `string`

  `default`: `dist-i18n`

  `alias`: `o`

The default language of the project

- `--default-lang`

  `type`: `string`

  `alias`: `o`

Determine rather to join also the default language

- `--include-default-lang`

  `type`: `boolean`

  `default`: `false`

## Split

### Overview

Does the opposite process of `join` command. It splits the translated files between the project's translation files.

### Command

```bash
ng generate @ngneat/transloco:split
```

### Options

The folder that contains the root translation files.

- `--translation-path`

  `type`: `string`

  `default`: `src/assets/i18n`

  `alias`: `root`

The path of the source directory that contains the translated files.

- `source`

  `type`: `string`

  `default`: `dist-i18n`

  `alias`: `o`

## Upgrade

### Overview

The Library's upgrade script from lower versions. For more information about the script see:
[v2-upgrade.md](https://github.com/ngneat/transloco/tree/master/schematics/src/upgrade/v2-upgrade.md)

### Command

```bash
 ng generate @ngneat/transloco:upgrade
```

### Options

#### Define the entry path of the upgrade script.

- `--path`

  `type`: `string`

  `default`: `./src/app`

  `alias`: `p`
